@charset "utf-8";
@import "reset";
$font-size:64px;
html{
    font-size: 64px;
}
@function r($px){
    @return $px/$font-size*1rem;
}
.topseach-box{
    width: 100%;
    height: 100%;
    position:absolute;
    left: 0;
    top: 0;
    overflow-x: hidden;
    overflow-y: auto;
    background: #f1f1f1;
    z-index: 4;
     opacity: 0;
     transition: .5s all linear;
     transform: translateX(100%);
    .register-top-box{
          width: 100%;
          background: #222222;
          .register-top{
              padding: r(18px) r(17px) r(17px) r(12px);
              font-size: 0;
              border-bottom: 1px solid #484848;
              .close2{
                  display: inline-block;
                  vertical-align: middle;
                  i{
                      font-size: r(50px);
                      color: red;
                  }
              }
              form{
                  padding-left: r(78px);
                  display: inline-block;
                  vertical-align: middle;
                  .search{
                      border: 1px solid #FFFFFF;
                      border-radius: 10px;
                      display: inline-block;
                      width: r(483px);
                      height: r(52px);
                      position: relative;
                      i{
                          position: absolute;
                          left: 5px;
                          top: 4px;
                          color: #FFFFFF;
                      }
                  }
                  input[type="search"]{
                      display: inline-block;
                      width: 100%;
                      height: 100%;
                      background-color: #1f1f1f;
                      border: 0;
                      border-radius: 10px;
                      padding-left: r(50px);
                  }
              }
          }
      }
      .topseach{
          width: 100%;
          padding: r(32px) 0 0 r(30px);
          font-size: 0;
          h3{
              font-size:16px;
              padding-bottom: r(16px);
          }
          .search-text{
              font-size:0;
                  .text{
                      display: inline-block;
                      font-size: 15px;
                      padding: r(13px) r(17px) r(12px) r(18px);
                      background: #FFFFFF;
                      border: 1px solid #e0e0e0;
                      color: #8b8b8b;
                      margin-right: r(8px);
                  }
          }
          
      }
}
.topseach_on{
    opacity: 1;
    width: 100%;
    transform: translateX(0);
    
}
